.guideBox{
	z-index: 999999;
	position: absolute;
	transition: all .3s ease-out;
}
.guideMask{
	inset: 0px;
	position: absolute;
	z-index: 999998;
	opacity: 0;
	transition: all .3s ease-out;
}
.tooltipBox{
	position: absolute;
	z-index: 999999;
	visibility: hidden;
	transition: all .3s ease-out;
}
.tooltipContent{
	box-sizing: content-box;
	position: absolute;
	visibility: visible;
	background-color: #fff;
	min-width: 250px;
	max-width: 300px;
	border-radius: 4px;
	box-shadow: 0 3px 30px rgb(33 33 33 / 30%);
	transition: opacity .1s ease-out;
}
.arrowBox{
	position: absolute;
	width: 0;
	height: 0;
}
.arrow-top{
	left: 5px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid white;
}
.arrow-down{
	top: -5px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom: 5px solid white;
}
.arrow-left{
	top: 5px;
	border-top: 5px solid transparent;
	border-left: 5px solid white;
	border-bottom: 5px solid transparent;
}
.arrow-right{
	left: -5px;
	border-top: 5px solid transparent;
	border-right: 5px solid white;
	border-bottom: 5px solid transparent;
}
.tooltipHeader{
	padding-right: 10px;
	float: right;
}
.tooltipText{
	padding: 20px;
}
.tooltipFooter{
	border-top: 1px solid #e0e0e0;
	padding: 10px;
	text-align: right;
	white-space: nowrap;
	span{
		cursor: pointer;
		margin: 0 10px;
	}
}
#tooltipClose{
	cursor: pointer;
}
